var titls = document.getElementById("tits");
var country_container_panel = document.getElementsByClassName("country-container-panel");
let first_panel = country_container_panel[0];
let second_panel = country_container_panel[1];

var select_cycode_result = document.getElementById("select-cycode-result");
titls.onclick = function(){

    first_panel.style.display = "block";

    // 获取ul标签
    var countryCollections = first_panel.children[0].children[1].getElementsByClassName("list");
    var countryCollections02 = second_panel.children[0].children[1].getElementsByClassName("list");
    // console.log(countryCollections)
    // 遍历每个ul, 并且给每个ul标签里的li设置事件
    for(let i = 0; i < countryCollections.length; i++){
        let indexLi = countryCollections[i].getElementsByTagName("li");
        let indexLi02 = countryCollections02[i].getElementsByTagName("li");
        for(var j = 0; j < indexLi.length; j++){
            indexLi[j].onclick = function(){
                titls.children[0].innerText = this.children[0].innerText;
                // alert(indexLi02[j].innerText);

                // 这个功能是为了实现选择第一个panel时, 底下的电话会发生改变
                for(let k = 0; k < indexLi02.length; k++){
                    if(this.children[0].innerText == indexLi02[k].children[0].innerText.trim())
                    select_cycode_result.innerText = indexLi02[k].children[1].innerText.trim()
                }

                // 选择完关掉
                first_panel.style.display = "none";
            }
        }
    }
}
var telePhone = document.getElementById("telePhone");
var telePhoneValue = "";
// 当鼠标移动到其他地方, 并且输入为空或者不为电话号码时, 输出警告结果
var errorTip = document.getElementById("error_tip");
telePhone.onblur = function(){
    let phoneReg = /^[1]([3-9])[0-9]{9}$/;
    if(telePhone.value.trim() == ""){
        errorTip.style.display = "block";
        errorTip.children[0].children[1].innerText = "请输入手机号"
    }
    else if(!phoneReg.test(telePhone.value)){
        errorTip.style.display = "block";
        errorTip.children[0].children[1].innerText = "请输入正确的手机号码"
    }else{
        // 将正确的电话保存起来, 下个页面还需用到
        telePhoneValue = telePhone.value;
        return true;
    }
}
telePhone.onmousedown = function(){
    errorTip.style.display = "none";
}


// 这里不用管
var isRead = document.getElementById("isRead");
var isChecked = document.getElementById("isChecked");
isChecked.onclick = function(){
    if(this.checked){
        isRead.children[1].innerText = "已阅读并同意: 小米";
    }else{
        isRead.children[1].innerText = "未阅读并同意: 小米";
    }
}








// 验证码部分
var registerBtn = document.getElementById("registerBtn");
// 将验证码保存起来
var vetifyNumber = "";
registerBtn.onclick = function(){
    if(telePhone.onblur() == true){
        // 如果输入的电话号码是正确的, 就把当前的登录部分关掉, 开启验证码部分
        // console.log(document.getElementsByClassName("regbox").style.display);
        document.getElementById("regbox").style.display = "none";
        document.getElementById("regboxTwo").style.display = "block";

        // 设置获取的手机号
        console.log(document.getElementsByClassName("address-place"))
        document.getElementById("getPhone").innerText = "+86 " + telePhoneValue;



        // 验证码开始时间
        // let verificationCodeTime = document.getElementById("verificationCodeTime");
        let index = 1;
        let btn = document.getElementsByClassName('remain')[0];
		btn.innerHTML = "重新发送(60)";

		function timer() {
			let time = 60 * index;
			btn.disabled = 'disabled';
			let timeSet = setInterval(function() {
				time--;
				btn.innerHTML = "重新发送(" + time + ")";
				if (time == 0) {
					clearInterval(timeSet);
					btn.innerHTML = "重新发送";
					btn.disabled = false;
				}
			}, 1000);
		}
		timer();

		btn.onclick = function() {
			index++;
			timer();
            regenerateVerificationCode();   
		}

        let regenerateVerificationCode = function(){
            // 随机生成四位数验证码
            let num = '';
            for (let i = 0; i < 4; i++) {
                num += (Math.random() * 10) | 0;
            }
            vetifyNumber = num;
            alert("您的验证码为: " + vetifyNumber);
        }
        regenerateVerificationCode();
    }
}

var nextStep = document.getElementById("nextStep");
var inputVertifyNumber = document.getElementById("inputVertifyNumber");
// 下一步: 跳转到设置密码界面, 同时判断验证码是否正确
nextStep.onclick = function(){
    if(inputVertifyNumber.value == vetifyNumber){
        // 输入的手机号继续显示到页面
        document.getElementById("pwdPhone").innerText = telePhoneValue;
        document.getElementById("regboxTwo").style.display = "none";
        document.getElementById("pwdPage").style.display = "block";
    }
    else{
        let errorVertifyNumber = document.getElementById("errorVertifyNumber");
        errorVertifyNumber.style.display = "block";
    }
}

// 当鼠标再次移动到验证码输入框时, 错误提示消失
inputVertifyNumber.onmousedown = function(){
    let errorVertifyNumber = document.getElementById("errorVertifyNumber");
    errorVertifyNumber.style.display = "none";
}

// 返回上一页
var backToRegister = document.getElementById("backToRegister");
backToRegister.onclick = function(){
    document.getElementsByClassName('regbox')[0].style.display = 'block';
	document.getElementsByClassName('regboxTwo')[0].style.display = 'none';
}








// 验证密码是否符合标准
var errorTwoPwdOrFormat = document.getElementById("errorTwoPwdOrFormat");
var pwdInput = document.getElementsByClassName("resendcode");
for(let i = 0; i < pwdInput.length; i++){
    pwdInput[i].onblur = function(){
        let pwdReg = /(?!.*\s)(?!^[\u4e00-\u9fa5]+$)(?!^[0-9]+$)(?!^[A-z]+$)(?!^[^A-z0-9]+$)^.{8,16}$/;
        if(!(pwdReg.test(this.value)) || !(pwdReg.test(this.value))){
            errorTwoPwdOrFormat.children[0].children[1].innerText = "密码格式有误, 请重新输入";
            errorTwoPwdOrFormat.style.display = "block";
        }if(this.value == "" || this.value == ""){
            errorTwoPwdOrFormat.style.display = "block";
            errorTwoPwdOrFormat.children[0].children[1].innerText = "密码不能为空, 请重新输入"
        }

        pwdInput[i].onmousedown = function(){
            errorTwoPwdOrFormat.style.display = "none";
        }

        if(pwdReg.test(this.value) && pwdReg.test(this.value) && this.value.trim() != "" && this.value.trim() != ""){
            return true;
        }
        else{
            return false;
        }
    }
}


// 设置密码页面

var pwdSubmit = document.getElementById("pwdSubmit");
pwdSubmit.onclick = function(){
    var pwd01 = document.getElementById("pwd01");
    var pwd02 = document.getElementById("pwd02");

    // 密码箱等, 并且输入格式正确时
    if(pwd01.value != pwd02.value){
        errorTwoPwdOrFormat.style.display = "block";
        errorTwoPwdOrFormat.children[0].children[1].innerText = "两次密码不正确请重新输入"
    }else if(pwd01.value == pwd02.value && pwd01.onblur() && pwd02.onblur()){
        alert("密码输入成功");
        document.getElementById("goToLogin").style.display = "block";
        document.getElementById("pwdPage").style.display = "none";
    }
}




//获取注册数据
function get() {
    //普通get
    //1. 获取表单中的数据
    let usertelephone = document.getElementById("telePhone").value;
    let password = document.getElementById("pwd01").value;
    let username = document.getElementById("telePhone").value;
    //2. 发送  跳转页面到登入
    window.location='/mi/login?userName='+username+"&userPassword="+password+"&userTelephone="+usertelephone;


    // // 原生ajax   不刷新页面所以不会跳转
    // //参数格式2 - json对象
    // let username = $("#telePhone").val();
    // let password = $("#pwd01").val();
    // let usertelephone = $("#telePhone").val();
    // let param={userName:username,userPassword:password,userTelephone:usertelephone};
    //
    // $.ajax({
    //     type:'get',
    //     url:'/mi/login',
    //     data: param,
    //     success:function(res){
    //         console.log(res)
    //     }
    // })



}